<template>
	<view class="container">
		<view class="wrapper">
			<view class="welcome">
				Terms of service
			</view>
			<view class="terms-container">
				Lorem ipsum dolor sit amet, consectetur adipiscing
				elit, sed do eiusmod tempor incididunt ut labore et
				dolore magna aliqua. Ut enim ad minim veniam,
				quis nostrud exercitation ullamco laboris nisi ut
				aliquip ex ea commodo consequat.
				
				Duis aute irure dolor in reprehenderit in voluptate
				velit esse cillum dolore eu fugiat nulla pariatur.
				Excepteur sint occaecat cupidatat non proident,
				sunt in culpa qui officia deserunt mollit anim id
				est laborum.
				
				Pellentesque habitant morbi tristique senectus et
				netus et malesuada fames ac turpis egestas ipsum.
				Vestibulum tortor quam, feugiat vitae, ultricies eget,
				tempor sit amet, ante eu libero sit amet quam.
				
				Aenean ultricies mi vitae est. Mauris placerat
				eleifend leo. Quisque sit est et sapien ullamcorper.
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
	page{
		background: #fff;
	}
	.container{
		position:relative;
		overflow: hidden;
		background: #fff;
	}
	.status_bar {
		height: var(--status-bar-height);
		width: 100%;
	}
	.wrapper{
		margin-top: 50rpx;
		position:relative;
		z-index: 90;
		background: #fff;
		padding-bottom: 40upx;
	}
	.welcome{
		position:relative;
		left: 40rpx;
		top: -30upx;
		font-weight: bold;
		font-size: $font-base + 2upx;
		color: #1C1C1C;
	}
	.terms-container {
		padding: 0 40rpx;
		font-style: normal;
		font-weight: normal;
		font-size: $font-sm + 2upx;
		line-height: 40rpx;
		color: #606060;
		white-space: pre-line;
	}
	.agree-btn{
		position: fixed;
		left: 30upx;
		right: 30upx;
		bottom: 180upx;
		z-index: 95;
		width: 700upx;
		height: 90upx;
		line-height: 90upx;
		border-radius: 90upx;
		background: #4666D5;
		color: #fff;
		font-family: Poppins;
		font-size: $font-base;
		font-weight: bold;
		box-shadow: 0px 4px 16px #76ED92;
		background: linear-gradient(7.53deg, #4666D5 0%, #2DC897 94.65%);
		&::after {
			content: "";
			background: url(/static/images/Check.png) no-repeat;
			background-size: contain;
		}
	}
	.decline-btn {
		position: fixed;
		left: 30upx;
		right: 30upx;
		bottom: 60upx;
		z-index: 95;
		width: 700upx;
		height: 90upx;
		line-height: 90upx;
		border-radius: 90upx;
		background: #4666D5;
		color: #fff;
		font-family: Poppins;
		font-size: $font-base;
		font-weight: bold;
		box-shadow: 0px 4px 16px #FF8FB2;
		background: linear-gradient(189.92deg, #EB658D 11.32%, #F8798F 88.1%);
		&::after {
			content: "";
			background: url(/static/images/Retry.png) no-repeat 1rem;
			background-size: 3rem 3rem;
		}
	}
</style>
